<!doctype html>
<html class="no-js" lang="en">
    <head>
        <link rel="shortcut icon" href="{{ FAVICON|replace('{filename}',SITEURL)|replace('|filename|',SITEURL) }}" />

        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta name="author" content="{{AUTHOR}}" />
        <title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
        
        {% block description %}
        <meta name="description" content="{{ SITESUBTITLE }}" />
        <meta name="keywords" content="Blog{% for keyword in BLOGKEYWORDS %} {{ keyword }}{% endfor %} "/>
        {% endblock description %}

        <!--[if !IE 7]>
        <style type="text/css">
            #main-content {display:table;height:100%}
        </style>
        <![endif]-->
        <link rel="stylesheet" href="{{ SITEURL }}/theme/css/backdrop.css" />
        <link rel="stylesheet" href="{{ SITEURL }}/theme/css/pygments.css" />
        <script src="{{ SITEURL }}/theme/js/modernizr.js"></script>

        {% if FEED_ALL_ATOM %}
        <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
        {% endif %}
        {% if FEED_ALL_RSS %}
        <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
        {% endif %}
        {% if FEED_ATOM %}
        <link href="{{ FEED_DOMAIN }}/{{ FEED_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
        {% endif %}
        {% if FEED_RSS %}
        <link href="{{ FEED_DOMAIN }}/{{ FEED_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
        {% endif %}
        {% if CATEGORY_FEED_ATOM and category %}
        <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_ATOM|format(category.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
        {% endif %}
        {% if CATEGORY_FEED_RSS and category %}
        <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_RSS|format(category.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
        {% endif %}
        {% if TAG_FEED_ATOM and tag %}
        <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_ATOM|format(tag.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
        {% endif %}
        {% if TAG_FEED_RSS and tag %}
        <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_RSS|format(tag.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
        {% endif %}

        {% if DISQUS_SITENAME %}
        <script type="text/javascript">
            var disqus_shortname = '{{ DISQUS_SITENAME }}'; 

            (function () {
                var s = document.createElement('script'); s.async = true;
                s.type = 'text/javascript';
                s.src = '//' + disqus_shortname + '.disqus.com/count.js';
                (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
            }());
        </script>
        {% endif %}
    </head>
      

    <body>
        <div class="master-row">

            <div class="content-pane main-content">
                <nav class="top-bar" data-topbar role="navigation">
                    <ul class="title-area">
                        <li class="name"><!-- Leave this empty --></li>
                        <li class="toggle-topbar menu-icon"><a href="#"><span></span></a></li>
                    </ul>
                    <section class="top-bar-section">
                        <ul class="left">
                        {% for p in pages %}
                            <li{% if p == page %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ p.url }}">{{ p.title }}</a></li>
                        {% endfor %}
                        </ul>
                        <ul class="right">
                        {% for cat, null in categories %}
                            <li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
                        {% endfor %}
                        </ul>
                    </section>
                </nav>

                <div class="row title-bar">
                    <div class="small-12 columns">
                        <h1><a href="{{ SITEURL }}">{{ SITENAME }}</a></h1><h2> <small>{{ SITESUBTITLE }}</small></h2>
                        <hr>
                    </div>
                </div>
            
                <div id="contents">
                {% block content %}
                    <div class="row">
                    </div>
                {% endblock content %}
                </div>

                <footer class="show-for-large-up">
                    {% include 'footer.html' %}
                </footer>
            </div>
            
            <div class="image-pane main-content" style="background: url('{{ BACKDROP_IMAGE|replace('{filename}',SITEURL)|replace('|filename|',SITEURL) }}'); background-size:cover; background-position: right;">
                <div class="row">
                    <div class="small-12 medium-4 large-12 columns">
                    {% if SITE_DESCRIPTION or EMAIL or SOCIAL %}
                        <h5 class='text-center'>About</h5>
                        <div class="about-me">
                        {% if PROFILE_IMAGE %}
                            <div class="hide-for-medium-only small-3 columns no-buffer">
                                <a class="th" href="{{ PROFILE_IMAGE|replace('{filename}',SITEURL)|replace('|filename|',SITEURL) }}">
                                    <img src="{{ PROFILE_IMAGE|replace('{filename}',SITEURL)|replace('|filename|',SITEURL) }}">
                                </a>
                            </div>
                        {% endif %}
                            <div class="{% if PROFILE_IMAGE %}small-9 medium-12 large-9{% else %}small-12{% endif %} columns text-justify">
                                {{ SITE_DESCRIPTION }}
                            </div>
                        {% if EMAIL or SOCIAL %}
                            <div class="small-12 columns">
                                <ul class="inline-center social-list">
                                {% if EMAIL%}
                                    <li><a href="mailto:{{ EMAIL}}"><i class="fa fa-envelope"></i>&nbsp; Email</a></li>
                                {% endif %}
                                {% for name,link in SOCIAL %}
                                    <li><a href="{{ link }}"><i class="fa fa-{{ name|lower }}"></i>&nbsp; {{ name }}</a></li>
                                {% endfor %}
                                </ul>
                            </div>
                        {% endif %}
                        </div>
                    {% endif %}
                    </div>

                    <div class="small-12 medium-4  large-12 columns link-list">
                    {% if LINKS %}
                        <h5 class='text-center'>Links</h5>
                        <ul class="inline-center">
                        {% for name, url in LINKS %}
                            <li><a href="{{ url }}">{{ name }}</a></li>
                        {% endfor %}
                        </ul>
                    {% endif %}
                    </div>

<!--
                    <div class="small-12 medium-3 large-12 columns">
                    {% if GITHUB_ACTIVITY_FEED %}
                        <table class='transparent'>
                            <thead>
                                <th class='text-center'>GitHub Activity</th>
                            </thead>
                            <tbody>
                            {% for entry in github_activity %}
                                <tr><td>{{ entry[1] }}</td></tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    {% endif %}
                    </div>
-->
               </div>
            </div>
        </div>
        
        
        <div class="row">
            <footer class="hide-for-large-up">
                {% include 'footer.html' %}
            </footer>
        </div>
        
        
        <script src="{{ SITEURL }}/theme/js/jquery.min.js"></script>
        <script src="{{ SITEURL }}/theme/js/foundation.min.js"></script>
        <script src="{{ SITEURL }}/theme/js/app.js"></script>
    </body>
  
</html>
